ul { list-style: none; margin: 0; padding: 0; }
a { text-decoration: none; }
#calendar-control { width: auto; margin: 0 10px; border: 1px solid #ddd; border-radius: 5px; }
#calendar-header { height: 50px; line-height: 50px; background-color: #00bff3; border-bottom: 2px solid #00acda; color: white; text-align: left; border-radius: 5px 5px 0 0; }
#calendar-header a { vertical-align: middle; display: inline-block; height: 30px; line-height: 30px; padding: 0 15px; font-size: 11px; border: 1px solid #ddd; color: rgba(255, 255, 255, .7); background-color: rgba(0, 0, 0, .3); border-radius: 5px; box-sizing: border-box; }
#calendar-header a.prev,
#calendar-header a.next { line-height: 26px; }
#calendar-header a:hover { color: #48ffff; }
.hello-msg,
.current-time,
.sys-time-btn,
#calendar-header .calendar-format { display: inline-block; margin-left: 15px; }
#calendar-header .calendar-format { float: right; list-style: none; margin: 0; padding: 0; height: 30px; width: auto; margin: 10px 15px; border: 1px solid #ddd; background: rgba(0, 0, 0, .3); border-radius: 5px; }
#calendar-header .calendar-format li { height: 30px; line-height: 30px; float: left; padding: 0 15px; cursor: pointer; font-size: 11px; color: rgba(255, 255, 255, .7); }
#calendar-header .calendar-format li:hover { color: #48ffff; }
#calendar-header .calendar-format li.active { background-color: rgba(48, 255, 255, .3); color: white; border-radius: 5px; }
#calendar-content { }
#calendar-content ul.table-header { width: 100%; }
#calendar-content ul.table-header li { float: left; width: 14.28%; font-weight: 500; height: 30px; line-height: 30px; background-color: #ddd; text-align: center; }
#calendar-content ul.table-header:after,
#calendar-content ul.table-content:after { content: ''; clear: both; display: block; }
#calendar-content ul.table-content { width: 100%; border: 1px solid #ddd; box-sizing: border-box; }
#calendar-content ul.table-content li { float: left; width: 14.28%; height: auto; line-height: 24px; background-color: white; border-right: 1px solid #ddd; border-bottom: 1px solid #ddd; box-sizing: border-box; padding: 15px; } 
#calendar-content ul.table-content li:nth-child(7n) { border-right: none; }
#calendar-content ul.table-content li:nth-child(n+29) { border-bottom: none; }
#calendar-content.week ul.table-content li { height: 400px; }
#calendar-content.list ul.table-header { display: none; }
#calendar-content.list ul.table-content li { width: 100%; }
#calendar-content.month ul.table-content li { height: 240px; }
#calendar-content .header { width: 100%; text-align: right; }
#calendar-content li { display: inline-block; vertical-align: middle; }
#calendar-content .isToday { float: left; background-color: #00acda; padding: 6px 12px; border: 1px solid #5bc0de; line-height: 1; border-radius: 4px; color: white; font-size: 10px; }
#calendar-content .Festival { float: left; font-size: 11px; color: #00acda; font-weight: 500; }
#calendar-content .IMonthCn { float: right; }
#calendar-content .IDayCn { float: right; color: #333; font-size: 18px; display: inline-block; }
#calendar-content .second-header { width: 100%; font-size: .5em; font-weight: normal; }
#calendar-content .CDay { float: right; display: inline-block; vertical-align: middle; font-size: 18px; font-weight: bold; }
#calendar-content .Term { float: right; margin-right: 5px; }
#calendar-content .header:after,
#calendar-content .second-header:after { content: ''; clear: both; display: block; }
#calendar-content .calendarDate { height: 50px; opacity: .3; }
#calendar-content .calendarDate.isCurr { opacity: 1; }
#calendar-content .calendarDate ~ .data-content-box { margin-top: 10px; }
#calendar-content .data-content-box { display: block; height: 150px; overflow-y: auto; }
#calendar-content .data-content { display: block; box-sizing: border-box; padding: 10px; border: 1px solid #ddd; border-radius: 4px; }
#calendar-content .data-content { width: 100%; cursor: pointer; }
#calendar-content .data-content .content-name { float: left; display: inline-block; vertical-align: middle; color: #333; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#calendar-content .data-content .content-body { display: block; vertical-align: middle; text-align: left; color: #999; font-size: 11px; text-indent: 2em; width: 100%; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#calendar-content .data-content-item { display: block; margin-bottom: 10px; }
#calendar-content .data-content-item:last-child { margin-bottom: 0; }
#calendar-content .data-content-item .content-del { display: none; transform: all 1s; width: 0; height: 70px; line-height: 20px; padding-top: 15px; box-sizing: border-box; background-color: #48aaaa; color: white; opacity: 1; font-size: 12px; text-align: center; }
#calendar-content .data-content-item:after { content: ''; clear: both; display: block; }
#calendar-content .data-content-item:hover .data-content { display: inline-block; float: left; width: 80%; }
#calendar-content .data-content-item:hover .content-del { display: inline-block; width: 19%; float: right; }